<template>
  <div class="myInfo">
    <div class="title">
      <span>语音呼叫</span>
      <div class="search">
        <input type="text" v-model="storeName" placeholder="请输入店铺名字..." />
        <button @click="search">搜索</button>
      </div>
    </div>
    <div class="store">
      <table class="head">
        <th width="5%">序号</th>
        <th width="8%">店铺名</th>
        <th width="8%">地址</th>
        <th width="8%">是否开通语音</th>
        <th width="10%">是否开通打赏</th>
        <th width="10%">是否开通排单机</th>
        <th width="6%">租赁</th>
        <!-- <th width="5%">商城</th> -->
        <th width="5%">折扣</th>
        <th width="5%">抹零</th>
        <!-- <th width="10%">结算查询</th> -->
        <th width="20%">店铺id</th>
        <th width="5%" @click="getAllStore(0,'TIME')">续费时间</th>
        <th width="15%">操作</th>
      </table>
      <table class="body">
        <tr v-for="(item,index) in storeData" :key="index">
          <td width="5%">{{index+1+(curPage-1)*size}}</td>
          <td width="8%">{{item.name}}</td>
          <td width="8%">{{item.addr}}</td>
          <td width="8%" :class="item.call?'':'no-open'" @click="isOpenCall(item)">{{item.call?"已开通":"未开通"}}</td>
          <td width="10%" :class="item.reward?'':'no-open'" @click="isOpenReward(item)">{{item.reward?"已开通":"未开通"}}</td>
          <td width="10%" :class="item.makeEnabled?'':'no-open'" @click="doShowSendOpen(item)">{{item.makeEnabled?"已开通":"未开通"}}</td>
          <td width="6%" :class="item.leaseProductEnabled?'':'no-open'" @click="doShowRent(item)">{{item.leaseProductEnabled?"已开通":"未开通"}}</td>
          <!-- <td width="5%" :class="item.purchaseEnabled?'':'no-open'" @click="isOpenPurchase(item)">{{item.purchaseEnabled?"已开通":"未开通"}}</td> -->

          <td width="5%" :class="item.discount?'':'no-open'" @click="isOpenDiscount(item)">{{item.discount?"开通":"未开通"}}</td>
          <td width="5%" :class="item.zero?'':'no-open'" @click="isOpenZero(item)">{{item.zero?"开通":"未开通"}}</td>
          <!-- <td width="10%" :class="item.onlineEnabled?'':'no-open'" @click="isOpenSettle(item)">{{item.onlineEnabled?"开通":"未开通"}}</td> -->

          <td width="20%" style="padding:1% 2%;">{{item.id}}</td>
          <td width="5%" >{{item.expireTime | dateForGradePage("yyyy-MM-dd hh:mm:ss")}}</td>
          <td width="15%">
            <el-date-picker v-model="item.callEndTime" type="datetime" style="width:100%" placeholder="选择日期">
            </el-date-picker>
            <span @click="saveTime(item)" style="cursor:pointer;">确认</span>
          </td>
        </tr>
      </table>
    </div>
    <div class="page right">
      <el-pagination background layout="prev, pager, next" :page-size="size" :total="totalElements" @current-change="handleCurrentChange">
      </el-pagination>
    </div>
    <!--  -->
    <el-dialog
    title="排单机"
    :visible.sync="showSendDialog"
    width="30%">
      <div class="form">
        <el-form ref="form" label-width="150px">
          <el-form-item label="是否开通排单机">
            <el-switch v-model="nowSelStore.makeEnabled"></el-switch>
          </el-form-item>
          <el-form-item label="到期时间">
            <el-date-picker type="date" placeholder="选择日期" v-model="nowSelStore.makeEndTime" style="width: 250px;"></el-date-picker>
          </el-form-item>
        </el-form>
      </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="showSendDialog = false">取 消</el-button>
      <el-button type="primary" @click="isOpenSend(nowSelStore)">确 定</el-button>
    </span>
  </el-dialog>
    <!--  -->
    <el-dialog
      title="租赁"
      :visible.sync="showRent"
      width="30%">
        <div class="form">
          <el-form ref="form" label-width="150px">
            <el-form-item label="是否开通租赁">
              <el-switch v-model="nowSelStore.leaseProductEnabled"></el-switch>
            </el-form-item>
            <el-form-item label="起始日期">
              <el-date-picker type="date" placeholder="选择日期" v-model="nowSelStore.leaseBeginDate" style="width: 250px;"></el-date-picker>
            </el-form-item>
            <el-form-item label="到期时间">
              <el-date-picker type="date" placeholder="选择日期" v-model="nowSelStore.leaseEndDate" style="width: 250px;"></el-date-picker>
            </el-form-item>
          </el-form>
        </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="cancelRent">取 消</el-button>
        <el-button type="primary" @click="isOpenRent(nowSelStore)">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {BASE_URL} from "./../../urlConfig";
export default {
  data() {
    return {
      showRent:false,
      showSendDialog:false,
      storeData: [],
      size: 10,
      totalElements: 0,
      curPage: 1,
      storeName:"",
      nowSelStore:{}
    };
  },
  methods: {
    cancelRent(){
      this.showRent = false;
    },
    doLeaseProductEnabled(item) {
      this.$http({
        url: BASE_URL+"v1/call/lease/enabled",
        method: "POST",
        data: {
          leaseProductEnabled: item.leaseProductEnabled ? false : true,
          storeId: item.id
        }
      }).then(res => {
        console.log(res);
        this.$message({
          message: "修改成功",
          type: "success"
        });
        this.getAllStore(this.curPage - 1);
      });
    },
    // 
    doShowRent(item){
      if(item){
        this.nowSelStore = JSON.parse(JSON.stringify(item));
      }
      this.showRent = true;
    },
    doShowSendOpen(item){
      if(item){
        this.nowSelStore = JSON.parse(JSON.stringify(item));
      }
      this.showSendDialog = true;
    },
    // 
    isOpenDiscount(item){
      this.$http({
        url: BASE_URL+"v1/call/update-discount",
        method: "POST",
        data: {
          storeId:item.id,
          discount:item.discount?0:1
        }
      }).then(res => {
        if(res.data.code == 200){
          this.$message({
            message: res.data.msg,
            type: "success"
          });
          this.getAllStore(this.curPage - 1);
        }
      });
    },
    isOpenSettle(item){
      this.$http({
        url: BASE_URL+"v1/call/online-enabled",
        method: "GET",
        params: {
          storeId:item.id,
          enabled:item.onlineEnabled?false:true
        }
      }).then(res => {
        // if(res.data.code == 200){
        //   this.$message({
        //     message: res.data.msg,
        //     type: "success"
        //   });
        // }
        this.$message({
          message: "请求成功",
          type: "success"
        });
        this.getAllStore(this.curPage - 1);
      });
    },
    isOpenZero(item){
      this.$http({
        url: BASE_URL+"v1/call/update-zero",
        method: "POST",
        data: {
          storeId:item.id,
          zero:item.zero?0:1
        }
      }).then(res => {
        if(res.data.code == 200){
          this.$message({
            message: res.data.msg,
            type: "success"
          });
          this.getAllStore(this.curPage - 1);
        }
      });
    },
    search(){
      this.$http({
        url: BASE_URL+"v1/call/get-store",
        method: "GET",
        params: {
          name:this.storeName
        }
      }).then(res => {
        console.log(res);
        this.storeData = res.data;
        this.totalElements = 0;
      });
    },
    handleCurrentChange(val) {
      this.getAllStore(val - 1);
      this.curPage = val;
    },
    //   是否开通语音
    isOpenCall(item) {
      let callEndTime = null;
      if(item.callEndTime){
        let date = new Date(item.callEndTime);
        callEndTime = date.Format("yyyy-MM-dd hh:mm:ss");
      }
      this.$http({
        url: BASE_URL+"v1/call/update-call",
        method: "POST",
        data: {
          call: item.call ? 0 : 1,
          callEndTime,
          storeId: item.id
        }
      }).then(res => {
        console.log(res);
        if (res.data.result.code == 200) {
          this.$message({
            message: "修改成功",
            type: "success"
          });
          this.getAllStore(this.curPage - 1);
        }
      });
    },
    saveTime(item) {
      let callEndTime = null;
      if(item.callEndTime){
        let date = new Date(item.callEndTime);
        callEndTime = date.Format("yyyy-MM-dd hh:mm:ss");
      }

      this.$http({
        url: BASE_URL+"v1/call/update-call",
        method: "POST",
        data: {
          call: item.call ? 1 : 0,
          callEndTime,
          storeId: item.id
        }
      }).then(res => {
        console.log(res);
        if (res.data.result.code == 200) {
          this.$message({
            message: "修改成功",
            type: "success"
          });
          this.getAllStore(this.curPage - 1);
        }
      });
    },
    getAllStore(page,type="other") {
      this.$http({
        url: BASE_URL+"v1/call/getAll",
        method: "GET",
        params: {
          page,
          size: this.size,
          type
        }
      }).then(res => {
        console.log(res);
        this.storeData = res.data.content;
        this.totalElements = res.data.totalElements;
      });
    },
    isOpenRent(item) {
      if(!item){
        return;
      }
      if(item.leaseProductEnabled && (!item.leaseBeginDate || !item.leaseEndDate)){
        this.$message({
            message: "请选择时间",
            type: "error"
          });
        return;
      }
      if(new Date(item.leaseBeginDate).getTime() > new Date(item.leaseEndDate).getTime()){
        this.$message({
            message: "请正确选择时间",
            type: "error"
          });
        return;
      }
      this.$http({
        url: BASE_URL+"v1/call/lease/enabled",
        method: "POST",
        data: {
          leaseBeginDate:new Date(item.leaseBeginDate).Format("yyyy-MM-dd 00:00:00"),
          leaseEndDate:new Date(item.leaseEndDate).Format("yyyy-MM-dd 23:59:59"),
          storeId: item.id,
          leaseProductEnabled: item.leaseProductEnabled
        }
      }).then(res => {
        this.showRent = false;
        this.$message({
            message: "修改成功",
            type: "success"
          });
        this.nowSelStore = {};
        this.getAllStore(this.curPage - 1);
      });
    },
    isOpenSend(item) {
      if(!item){
        return;
      }
      if(item.makeEnabled && !item.makeEndTime){
        this.$message({
            message: "请选择时间",
            type: "error"
          });
        return;
      }
      this.$http({
        url: BASE_URL+"v1/call/update-make",
        method: "POST",
        data: {
          makeEndTime:new Date(item.makeEndTime).Format("yyyy-MM-dd 23:59:59"),
          makeEnabled: item.makeEnabled,
          storeId: item.id
        }
      }).then(res => {
        this.showSendDialog = false;
        this.$message({
            message: "修改成功",
            type: "success"
          });
        this.nowSelStore = {};
        this.getAllStore(this.curPage - 1);
      });
    },
    // 开通打赏
    isOpenReward(item) {
      this.$http({
        url: BASE_URL+"v1/call/update-storeReward",
        method: "POST",
        data: {
          reward: item.reward ? 0 : 1,
          storeId: item.id
        }
      }).then(res => {
        console.log(res);
        if (res.data.result.code == 200) {
          this.$message({
            message: "修改成功",
            type: "success"
          });
          this.getAllStore(this.curPage - 1);
        }
      });
    },
    // 开通商城
    isOpenPurchase(item) {
      this.$http({
        url: BASE_URL+"v1/stock/pur-merge",
        method: "POST",
        data: {
          purchaseEnabled: item.purchaseEnabled ? false : true,
          storeId: item.id
        }
      }).then(res => {
        console.log(res);
        // if (res.data.result.code == 200) {
          this.$message({
            message: "修改成功",
            type: "success"
          });
          this.getAllStore(this.curPage - 1);
        // }
      });
    }
  },
  created: function() {},
  mounted() {
    this.getAllStore(0);
  }
};
</script>
<style lang="scss" scoped>
@import "./call.scss";
.body{
  td{
    white-space:pre-wrap;
    word-break:break-all;
  }
}
</style>
